<template>
	<view class="detail-wrap query-wrap">
		<view class="detail-row" @click="dateEvent('startTime')">
			<view class="detail-row-label">
				<text>开始时间</text>
			</view>
			<view class="detail-row-value">
				{{ startTime }}
			</view>
		</view>
		<view class="detail-row" @click="dateEvent('endTime')">
			<view class="detail-row-label">
				<text>结束时间</text>
			</view>
			<view class="detail-row-value">
				{{ endTime }}
			</view>
		</view>
		
		<button class="cu-btn block bg-blue margin lg " @click="submit">
			查询
		</button>
		
		<w-picker
			mode="date" 
			startYear="2000" 
			endYear="2050"
			step="1"
			:defaultVal="[1,1,1,1,2,5]" 
			:current="true" 
			@confirm="onConfirm" 
			ref="dateTime" 
			themeColor="#f00"
		></w-picker>
	</view>
	
</template>

<script>
	import wPicker from "@/components/w-picker/w-picker.vue";
	let dateTimekey='';
	export default {
		data() {
			return {
				startTime: this.$utils.GetDateAfter(-5)  ,
				endTime:this.$utils.getToDay(),
			};
		},
		components:{
			wPicker
		},
		methods:{
			submit(){
				let a =  {s:this.startTime+' 00:00:00' ,e:this.endTime +' 23:59:59' } ;
				uni.$emit('updateApproval',a);
				uni.navigateBack({})
				// uni.navigateTo({
				// 	url:'/pages/tab04/approval'
				// })
			},
			
			onConfirm(val){
				this[dateTimekey] = val.result ;
			},
			
			dateEvent(id){
				dateTimekey = id ;
				this.$refs.dateTime.show();
			},
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #FFFFFF;
	}
.detail-wrap {
		padding: 0 40rpx;
		background-color: #fff;

		.detail-row {
			padding: 30rpx 0;
			border-bottom: 1rpx solid $uni-border-color;
			display: flex;
			flex-wrap: wrap;
			align-items: center;
		}

		.detail-row:last-child {
			border-bottom: none;
		}

		.detail-row-label {
			width: 120rpx;
			color: #333;

			text {
				display: inline-block;
				width: 120rpx;
				text-align-last: justify;
			}
		}

		.detail-row-value {
			width: calc(100% - 120rpx);
			word-break: break-all;
			color: #999;
			padding-left: 40rpx;
		}
	}
	
.query-wrap{
	.margin{
		margin: 80rpx 0;
	}
}
</style>
